import { Component, Input, OnInit } from '@angular/core';
import { NavParams, ModalController } from '@ionic/angular';

declare var window;
@Component({
    selector: 'multiple-select',
    templateUrl: './multiple-select.html',
    styleUrls: ['multiple-select.scss']
})
export class MultipleSelectModal implements OnInit {

    @Input() options;
    @Input() showRemark;         // 默认true,显示备注
    @Input() onlyLastShowRemark; // 默认false,只有点击最后一个才显示备注
    @Input() onlyOne;            // 默认false,显示多选，
    @Input() remarkLen;          // 备注长度,默认60
    keyboardStatus = 'hide'
    showLastShowRemark;
    checkValue;

    constructor(params: NavParams, public modalCtrl: ModalController) {
        // console.log('options', params.get('options'));
        // this.options = params.get('options');
        // this.showRemark = params.get('showRemark');
        // this.onlyLastShowRemark = params.get('onlyLastShowRemark') || false;
        // this.onlyOne = params.get('onlyOne') || false;
        // this.remarkLen = params.get('remarkLen') || 60;
    }

    ngOnInit() {
        window.addEventListener('keyboardWillShow', (event) => {
            // Describe your logic which will be run each time when keyboard is about to be shown.
            this.keyboardStatus = 'show';
        });

        window.addEventListener('keyboardWillHide', (event) => {
            // Describe your logic which will be run each time when keyboard is about to be closed.
            this.keyboardStatus = 'hide';
        });
        if (!this.onlyOne) {
            this.onlyOne = false;
        } else {
            this.onlyOne = true;
            this.options.list.forEach(function (each) {
                each.checked = false;
            });
            this.options.list[0].checked = true;
        }
        if (!this.onlyLastShowRemark) {
            this.showLastShowRemark = false;
        } else {
            this.showLastShowRemark = true;
        }
        if (!this.remarkLen) { this.remarkLen = 60; }
        if (!this.options.remark) { this.options.remark = ''; }
    }

    // 选择item
    seletedItem(data, index) {
        if (this.onlyLastShowRemark) {
            if (index === (this.options.list.length - 1)) {
                this.showRemark = true;
            } else {
                this.showRemark = false;
            }
        }
        if (this.onlyOne) {
            this.options.list.forEach(function (each) {
                each.checked = false;
            });
            data.checked = true;
        } else {
            if (data.checked === undefined) {
                data.checked = true;
            } else {
                data.checked = !data.checked;
            }
        }
    }

    btnCancel() {
        this.modalCtrl.dismiss();
    }

    btnOk() {
        this.options.value = [];
        console.log(this.options);
        if (this.options.attrName) {
            for (let i = 0; i < this.options.list.length; i++) {
                if (this.options.list[i].checked) {
                    console.log(this.options);
                    this.options.value.push(this.options.list[i]);
                }
            }
        }
        this.modalCtrl.dismiss(this.options);
    }

}
